<template>
  <div>
    <!-- 创建查询条件 -->
    <TopFilter ref="formPanel" :list="topFilterList" :cols="4" :collapse="true" @filterChange="changeHandle"></TopFilter>
    <!-- 创建一个查询table -->
    <FilterTable
      ref="table"
      :fetchapi="fetchApi"
      :columns="columns"
      :params="fetchParams"
      :datakey="'rows'"
      :onColumnsChange="columns => (this.columns = columns)"
      selectionType="single"
      :isExportExcel="true"
      exportFileName="维修回访明细统计报表.xlsx"
    >
      <!-- <template slot="controls">
        <el-button size="small" type="primary" icon="el-icon-download" :loading="exportLoading" @click="exportData()">导出</el-button>
      </template> -->
    </FilterTable>
  </div>
</template>

<script>
import { dictionary } from '@/utils/dictMixin';
import { getRepairVisitDetail, exportRepairVisitDetail } from '@/api/customerRepair/visitAnalysis/repairVisitDetail';
import { getAllUser } from '@/api/customerRepair/usedCarVisit/resultEntry';
import { exportExcelFile, arrayObjDeWeight } from '@/utils/index';
import { getSeries } from '@/api/customerRepair/customerCare/insuranceDueRemind/index';

export default {
  mixins: [dictionary],
  // 组件注册
  // components: {
  //   RtmAlarmDetail,
  //   EditAlarmDetail
  // },
  // 绑定数据定义
  data() {
    this.BaseTable = null;
    return {
      topFilterList: this.createTopFilterList(),
      fetchApi: getRepairVisitDetail,
      fetchParams: { xhrAbort: true },
      columns: this.createColumns(),
      type: null,
      exportLoading: false
    };
  },
  created() {},
  mounted() {
    this.BaseTable = this.$refs.table.$refs.pageTable;
    this.getAllUser();
    this.getService();
  },

  // 处理方法
  methods: {
    // 关闭页面触发事件
    // 创建查询条件
    createTopFilterList() {
      return [
        {
          type: 'RANGE_DATE',
          label: '日期范围',
          style: { minWidth: '200px' },
          fieldName: 'inputDateS|inputDateE',
          valueFormat: 'yyyy-MM-dd'
        }
      ];
    },
    createColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '回访时间',
          dataIndex: 'HFRQ',
          sorter: true,
          filter: true,
          filterType: 'date-range',
          dateFormat: 'yyyy-MM-dd'
        },
        {
          title: '回访员姓名',
          dataIndex: 'HFR',
          width: 150,
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: [],
          editType: 'select',
          editable: false,
          editItems: []
        },
        {
          title: '车主姓名',
          dataIndex: 'KHMC',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '联系人姓名',
          dataIndex: 'LXRMC',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        // {
        //   title: '车系代码',
        //   dataIndex: 'SERIES_NAME',
        //   showOverflowTooltip: true,
        //   sorter: true,
        //   filter: true,
        //   filterType: 'input',
        //   render: props => {
        //     return <span>{props.row.SERIES_NAME}</span>;
        //   }
        // },
        {
          title: '车系',
          dataIndex: 'CXIMC',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '车型',
          dataIndex: 'CXINGMC',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '车牌',
          dataIndex: 'PZH',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '回访单主编号',
          dataIndex: 'HFDH',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '回访状态',
          dataIndex: 'HFZT',
          sorter: true,
          filter: true,
          filterType: 'input',
          dictItems: [
            { text: '未关爱', value: 15921001 },
            { text: '继续关爱', value: 15921002 },
            { text: '成功关爱', value: 15921003 },
            { text: '失败关爱', value: 15921004 }
          ]
          // render: props => {
          //   return <span>{this.createDictText(props.row.HFZT, '8058')}</span>;
          // }
        },
        {
          title: '回访状态原因',
          dataIndex: 'HFZTYY',
          sorter: true,
          filter: true,
          filterType: 'input',
          dictItems: [
            { text: '电话空号', value: 80841001 },
            { text: '用户拒绝电访', value: 80841002 },
            { text: '电话号码错误', value: 80841003 },
            { text: '具体人员不在', value: 80841004 },
            { text: '手机关机', value: 80841005 },
            { text: '电话停机', value: 80841006 },
            { text: '电话无人应答', value: 80841007 },
            { text: '所填信息错误', value: 80841008 },
            { text: '其它', value: 80841009 }
          ]
          // render: props => {
          //   return <span>{this.createDictText(props.row.HFZTYY, '8084')}</span>;
          // }
        },
        {
          title: '满意度得分',
          dataIndex: 'MYDDF',
          sorter: true,
          filter: true,
          filterType: 'number'
        },
        {
          title: '不满意原因1',
          dataIndex: 'BMYYYFL',
          sorter: true,
          filter: true,
          filterType: 'input',
          dictItems: [
            { text: '服务人员的用户对待', value: 82011001 },
            { text: '替代交通服务', value: 82011002 },
            { text: '服务费用', value: 82011003 },
            { text: '服务时间', value: 82011004 },
            { text: '维修/保养质量', value: 82011005 },
            { text: '硬件设施', value: 82011006 },
            { text: '其他', value: 82011007 }
          ]
          // render: props => {
          //   return <span>{this.createDictText(props.row.BMYYYFL, '8201')}</span>;
          // }
        },
        {
          title: '不满意原因2',
          dataIndex: 'BMYYYFL2',
          sorter: true,
          filter: true,
          filterType: 'input',
          dictItems: [
            { text: '服务人员的用户对待', value: 82011001 },
            { text: '替代交通服务', value: 82011002 },
            { text: '服务费用', value: 82011003 },
            { text: '服务时间', value: 82011004 },
            { text: '维修/保养质量', value: 82011005 },
            { text: '硬件设施', value: 82011006 },
            { text: '其他', value: 82011007 }
          ]
          // render: props => {
          //   return <span>{this.createDictText(props.row.BMYYYFL, '8201')}</span>;
          // }
        },
        {
          title: '不满意原因3',
          dataIndex: 'BMYYYFL3',
          sorter: true,
          filter: true,
          filterType: 'input',
          dictItems: [
            { text: '服务人员的用户对待', value: 82011001 },
            { text: '替代交通服务', value: 82011002 },
            { text: '服务费用', value: 82011003 },
            { text: '服务时间', value: 82011004 },
            { text: '维修/保养质量', value: 82011005 },
            { text: '硬件设施', value: 82011006 },
            { text: '其他', value: 82011007 }
          ]
          // render: props => {
          //   return <span>{this.createDictText(props.row.BMYYYFL, '8201')}</span>;
          // }
        },
        {
          title: '不满意原因4',
          dataIndex: 'BMYYYFL4',
          sorter: true,
          filter: true,
          filterType: 'input',
          dictItems: [
            { text: '服务人员的用户对待', value: 82011001 },
            { text: '替代交通服务', value: 82011002 },
            { text: '服务费用', value: 82011003 },
            { text: '服务时间', value: 82011004 },
            { text: '维修/保养质量', value: 82011005 },
            { text: '硬件设施', value: 82011006 },
            { text: '其他', value: 82011007 }
          ]
          // render: props => {
          //   return <span>{this.createDictText(props.row.BMYYYFL, '8201')}</span>;
          // }
        },
        {
          title: '不满意原因5',
          dataIndex: 'BMYYYFL5',
          sorter: true,
          filter: true,
          filterType: 'input',
          dictItems: [
            { text: '服务人员的用户对待', value: 82011001 },
            { text: '替代交通服务', value: 82011002 },
            { text: '服务费用', value: 82011003 },
            { text: '服务时间', value: 82011004 },
            { text: '维修/保养质量', value: 82011005 },
            { text: '硬件设施', value: 82011006 },
            { text: '其他', value: 82011007 }
          ]
          // render: props => {
          //   return <span>{this.createDictText(props.row.BMYYYFL, '8201')}</span>;
          // }
        }
      ];
    },
    // 查询条件触发方法
    changeHandle(val) {
      this.fetchParams = Object.assign({}, val, { offset: 0, xhrAbort: false });
    },
    // 所有用户
    async getAllUser() {
      const res = await getAllUser();
      let data = arrayObjDeWeight(res.data, 'userId'); // 人员去重(解决前端报错)
      this.columns.find(x => x.dataIndex === 'HFR').filterItems = this.columns.find(item => item.dataIndex === 'HFR').editItems = data.map(x => ({
        value: x.userId + '',
        text: x.employeeName
      }));
    },
    async getService() {
      const res = await getSeries();
      // this.topFilterList.find(x => x.fieldName === 'SERIES_NAME').itemList = res.data.map(x => ({ text: x.SERIES_CODE + '', value: x.SERIES_CODE + '' }));
      this.columns.find(x => x.dataIndex === 'SERIES_NAME').editItems = res.data.map(x => ({ text: x.SERIES_NAME, value: x.SERIES_CODE + '' }));
    },
    // 导出
    exportData() {
      this.exportLoading = true;
      exportRepairVisitDetail(this.fetchParams).then(res => {
        exportExcelFile(res, '维修回访明细报表');
      });
      this.exportLoading = false;
    }
  }
};
</script>
